<template>
    <div class="ido-content">
        <div class="ant-row box" style="row-gap: 0px;">
            <div class="ant-row box-info" style="row-gap: 0px;">
                <div class="infoBox infoBox-l flex-1" style="background: rgb(140, 246, 244);">
                    <div class="ant-row flex-direction-column font-weight-b" style="row-gap: 0px;">
                        <div class="ant-col font-18">IDO合约参数设置</div>
                    </div>
                    <div class="ant-row infoList mt-24 flex-direction-column font-14  font-weight-b"
                         style="row-gap: 0px;">
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">收U地址</div>
                            <div class="ant-col font-weight-4">{{DAOAddress.length > 2? DAOAddress.substring(0, 4) + "****" + DAOAddress.substring(DAOAddress.length - 4): DAOAddress}}</div>
                        </div>
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">代币合约</div>
                            <div class="ant-col font-weight-4">{{tokenAddress.length > 2? tokenAddress.substring(0, 4) + "****" + tokenAddress.substring(DAOAddress.length - 4): tokenAddress}}</div>
                        </div>
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">众筹币合约</div>
                            <div class="ant-col font-weight-4">{{UAddress.length > 2? UAddress.substring(0, 4) + "****" + UAddress.substring(DAOAddress.length - 4): UAddress}}</div>
                        </div>
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">代币精度</div>
                            <div class="ant-col font-weight-4">{{decimals}}</div>
                        </div>
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">总募集资金</div>
                            <div class="ant-col font-weight-4"><input type="text" class="input" v-model="toTalAmount" /> USDT</div>
                        </div>
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">售价</div>
                            <div class="ant-col font-weight-4"><input type="text" class="input" v-model="price" /> USDT</div>
                        </div>
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">单笔最小募集</div>
                            <div class="ant-col font-weight-4"><input type="text" class="input" v-model="minAmount" /> USDT</div>
                        </div>
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">单笔最大募集</div>
                            <div class="ant-col font-weight-4"><input type="text" class="input" v-model="maxAmount" /> USDT</div>
                        </div>
                        <div class="btn11">
                            <button type="button" class="ant-btn ant-btn-block confirmBtn mt-24" style="background:#F63C45" @click="buy"><span>{{this.pending? "修改中...":  "修改"}}</span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="ant-row box" style="row-gap: 0px;">
            <div class="ant-row box-info" style="row-gap: 0px;">
                <div class="infoBox infoBox-l flex-1" style="background: rgb(140, 246, 244);">
                    <div class="ant-row flex-direction-column font-weight-b" style="row-gap: 0px;">
                        <div class="ant-col font-18">IDO合约开关设置</div>
                    </div>
                    <div class="ant-row infoList mt-24 flex-direction-column font-14  font-weight-b"
                         style="row-gap: 0px;">
                        <div class="ant-row ant-row-space-between infoItem mt-14" style="row-gap: 0px;">
                            <div class="ant-col">是否开启</div>
                            <div class="ant-col font-weight-4">{{isOpen? '开启': '关闭'}} <span @click="setStart" style="margin-left: 20px; text-decoration: underline">{{this.startPending?'切换中...': '切换'}}</span></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
     
     
    import {
        getIdoPrice, idoBegin, idoMin, idoMax, idoBuy, idoApprove, setStart,
        geIdoTotalAmount,
        geIdoDaoAddress,
        geIdoTokenAddress,
        geIdoUAddress,
        getIdoDecimals, idoChange
    } from '../dapp'
    import {USDT_CONTRACT_ADDRESS, IDO_CONTRACT_ADDRESS} from "../abi";


    export default {
         
        data() {
            return {
                price: '-',
                isOpen: false,
                minAmount: "-",
                maxAmount: "-",
                pending: false,
                toTalAmount: '-',
                DAOAddress: '-',
                tokenAddress: '-',
                UAddress: '-',
                decimals: '-',
                startPending: false
            }
        },
        computed: {},
        mounted() {
            this.init();
            this.getStart();
        },
        methods: {
            async init() {
                this.price = await getIdoPrice(IDO_CONTRACT_ADDRESS);
                this.minAmount = await idoMin(IDO_CONTRACT_ADDRESS);
                this.maxAmount = await idoMax(IDO_CONTRACT_ADDRESS);
                this.toTalAmount = await geIdoTotalAmount(IDO_CONTRACT_ADDRESS);
                this.DAOAddress = await geIdoDaoAddress(IDO_CONTRACT_ADDRESS);
                this.tokenAddress = await geIdoTokenAddress(IDO_CONTRACT_ADDRESS);
                this.UAddress = await geIdoUAddress(IDO_CONTRACT_ADDRESS);
                this.decimals = await getIdoDecimals(IDO_CONTRACT_ADDRESS);
            },
            async getStart() {
                this.isOpen = await idoBegin(IDO_CONTRACT_ADDRESS);
            },
            async buy() {
                if(this.pending) return ;
                this.pending = true;
                try{
                   var tx = await idoChange(IDO_CONTRACT_ADDRESS, this.DAOAddress, this.tokenAddress, this.UAddress, this.minAmount, this.maxAmount, this.toTalAmount, this.price, this.decimals);;
                    if(tx){
                        Toast('修改成功，请等待区块确认，稍后刷新查看');
                    }
                    this.pending = false;
                }catch (e) {
                    this.pending = false;
                    console.log("Error", e)
                }
            },
            async setStart() {
                if(this.startPending) return ;
                this.startPending = true;
                try{
                   var tx = await setStart(IDO_CONTRACT_ADDRESS);
                    if(tx){
                        Toast('切换成功，请等待区块确认，稍后刷新查看');
                    }
                    this.startPending = false;
                }catch (e) {
                    this.startPending = false;
                    console.log("Error", e)
                }
            },
        }

    }

</script>
<style lang="less" scoped>
    .ido-content {
        padding-bottom: 80px;

        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;

        .idoTitle {
            line-height: 40px;
            width: 674px;
        }

        .box {
            width: 900px;
            max-width: 100%;

            .box-top {
                width: 100%;
                height: 160px;
                background: #2F86FF;
                border-radius: 10px 10px 0 0;

                .saleStarts {
                    height: 20px;
                }

                .countItem {
                    width: auto;
                }

                .timeIcon {
                    margin-left: 10px;
                    margin-right: 10px;
                }
            }

            .box-info {
                height: 386px;

                .infoBox-l {
                    border-radius: 0 0 0 10px;
                }

                .infoBox-r {
                    border-radius: 0 0 10px 0;
                }

                .infoBox {
                    padding: 30px 78px 30px 40px;

                    .join {
                        margin-top: 58px;
                        width: 304px;
                        max-width: 100%;
                        line-height: 22px;
                    }

                    .minIcon {
                        vertical-align: middle;
                        width: 20px;
                        height: 20px;
                    }
                }
            }
        }

        .linkList {
            margin-top: 78px;
            margin-bottom: 98px;

            .linkIcon {
                width: 32px;
                height: 32px;
            }
        }
    }
    .ant-input-number-input-wrap{
        display: flex;
        flex-direction: row;
    }
    .ant-input-number-group-wrapper {
        height: 50px;
        width: 100%;
    }

    .ant-input-number-input {
        height: 50px !important;
        width: 100%;
        padding: 0 11px;
        background: #fff;
        text-align: left;
        border: 0;
        border-radius: 2px;
        outline: 0;
        transition: all .3s linear;
        -webkit-appearance: textfield!important;
        -moz-appearance: textfield!important;
        appearance: textfield!important;
    }



    .ant-input-number {
        border-radius: 10px 0 0 10px !important;
    }

    .ant-input-number-group-addon {
        border-radius: 0 10px 10px 0 !important;
    }

    .ant-input-number-group {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        color: rgba(0,0,0,.85);
        font-size: 14px;
        font-variant: tabular-nums;
        line-height: 1.5715;
        list-style: none;
        font-feature-settings: "tnum","tnum";
        position: relative;
        display: table;
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }
    .ant-input-number-group .ant-input-number{
        float:left;
    }

    .ant-input-number, .ant-input-number-group-addon {
        border: none !important;
        height: 50px;
        line-height:50px;
    }

    .ant-input-number-group-addon {
        background-color: #FFFFFF !important;
        position: relative;
        top: -50px;
        padding: 0 11px;
        color: rgba(0,0,0,.85);
        font-weight: 400;
        font-size: 14px;
        text-align: center;
        background-color: #fafafa;
        float:right;
        border: 1px solid #d9d9d9;
        border-radius: 2px;
        transition: all .3s;
    }

    .ant-input-number:focus, .ant-input-number-focused {
        box-shadow: none !important;
    }
    .btn11{
        height: 50px;
        margin-top: 20px;
    }
    .confirmBtn {
        margin-top: 0 !important;
        border-radius: 25px !important;
        height: 50px !important;
        width: 184px !important;
        font-size: 20px !important;
        font-weight: bold !important;
        color: #FFFFFF !important;
    }

    @media only screen and (max-width: 1000px) {
        .ido-content {
            .idoTitle {
                display: none;
            }

            .box {
                margin-top: 0;
                padding: 0 10px;
                .box-top {
                    height: 150px;
                    border-radius: 10px;
                }

                .box-info {
                    height: auto;
                    margin-top: 20px;
                    flex-direction: column;

                    .infoBox-l,
                    .infoBox-r {
                        border-radius: 10px;
                    }

                    .infoBox-r {
                        margin-top: 20px;
                    }

                    .infoBox {
                        padding: 20px 22px 30px 20px;

                        .goal {
                            margin-top: 20px;
                            font-size: 36px;
                            line-height: 40px;
                        }

                        .infoList {
                            margin-top: 20px;
                        }
                    }
                }
            }

            .linkList {
                margin-top: 60px;
                margin-bottom: 78px;
                flex-direction: column;

                .linkItem {
                    margin-top: 20px;
                    margin-left: 0;

                }

                .linkItem:first-child {
                    margin-top: 0;
                }
            }
        }

        .confirmBtn {
            width: 100% !important;
        }
    }
    * {
      outline: none;
      -ms-overflow-style: none !important; /* IE and Edge */
      scrollbar-width: none !important; /* Firefox */
    }

    *::-webkit-scrollbar {
      display: none !important;
    }

    html,
    body,
    #root {
      height: 100%;
      font-size: 12px;
      font-family: "Archivo",-apple-system, BlinkMacSystemFont;
      font-weight: 400;
      color: #000000;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      overflow: auto;
      background: linear-gradient(180deg, rgba(140, 246, 244, 0.75) 0%, rgba(255, 255, 255, 0.75) 100%), #2F86FF;
      background-blend-mode: lighten, normal;
    }

    body {
      background: linear-gradient(180deg, rgba(140, 246, 244, 0.75) 0%, rgba(255, 255, 255, 0.75) 100%), #2F86FF;
      margin: 0;
      box-sizing: border-box;
    }

    .app {
      height: 100vh;
      width: 100vw;
      display: flex;
      flex-flow: column;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      z-index: 1;
      background-size: cover;
      overflow: hidden;
      transition: all ease 0.33ms;
    }

    .container{
      width: 100%;
      max-width: 1440px;
    }

    .font-12 {
      font-size: 12px;
    }

    .font-14 {
      font-size: 14px;
    }

    .font-16 {
      font-size: 16px;
    }

    .font-18 {
      font-size: 18px;
      line-height: 20px;
    }

    .font-28 {
      font-size: 28px;
    }

    .font-32 {
      font-size: 32px;
    }

    .font-36 {
      font-size: 36px;
    }

    .font-48 {
      font-size: 48px;
      line-height: 50px;
    }

    .color1 {
      color: #000000!important;
    }

    .color3 {
      color: #FFFFFF!important;
    }

    .color2 {
      color: rgba(0, 0, 0, 0.54);
    }

    .color4 {
      color: #151515;
    }

    .color5 {
      color: #00090F;
    }

    .color6 {
      color: rgba(0, 0, 0, 0.38);
    }

    .color7 {
      color: rgba(0, 0, 0, 0.87);
    }

    .color8 {
      color: #381099;
    }

    .font-family-Archivo {
      font-family: 'Archivo',-apple-system, BlinkMacSystemFont;
    }

    .font-family-ArchivoBlack {
      font-family: 'ArchivoBlack';
    }

    .font-weight-4 {
      font-weight: 400;
    }

    .font-weight-6 {
      font-weight: 600;
    }

    .font-weight-9 {
      font-weight: 900;
    }

    .font-weight-b {
      font-weight: bold;
    }

    .mt-2 {
      margin-top: 2px;
    }

    .mt-6 {
      margin-top: 6px;
    }

    .mt-8 {
      margin-top: 8px;
    }

    .mt-10 {
      margin-top: 10px;
    }

    .mt-12 {
      margin-top: 12px;
    }

    .mt-14 {
      margin-top: 14px;
    }

    .mt-16 {
      margin-top: 16px;
    }

    .mt-20 {
      margin-top: 20px;
    }

    .mt-24 {
      margin-top: 24px;
    }

    .mt-26 {
      margin-top: 26px;
    }

    .mt-30 {
      margin-top: 30px;
    }

    .mt-40 {
      margin-top: 40px;
    }

    .ml-8 {
      margin-left: 8px;
    }

    .ml-12 {
      margin-left: 12px;
    }

    .ml-20 {
      margin-left: 20px;
    }

    .ml-24 {
      margin-left: 24px;
    }

    .ml-28 {
      margin-left: 28px;
    }

    .ml-30 {
      margin-left: 30px;
    }

    .mr-10 {
      margin-right: 10px;
    }

    .bg1 {
      background: #FFFFFF;
    }

    .border-radius-4 {
      border-radius: 4px;
    }

    .border-radius-8 {
      border-radius: 8px;
    }

    .flex {
      display: flex;
    }

    .flex-1 {
      flex: 1;
    }

    .flex-2 {
      flex: 2;
    }

    .flex-justify-content-center {
      justify-content: center;
    }

    .flex-justify-content-between {
      justify-content: space-between;
    }

    .flex-justify-content-around {
      justify-content: space-around;
    }

    .flex-justify-content-end {
      justify-content: flex-end;
    }

    .flex-justify-content-start {
      justify-content: flex-start;
    }

    .flex-align-items-center {
      align-items: center;
    }

    .flex-align-items-end {
      align-items: flex-end;
    }

    .flex-align-items-start {
      align-items: flex-start;
    }

    .flex-direction-column {
      flex-direction: column!important;
    }

    .flex-wrap {
      flex-wrap: wrap;
    }

    .text-left {
      text-align: left;
    }

    .text-right {
      text-align: right;
    }

    .text-center {
      text-align: center;
    }

    .ant-row {
      width: 100%;
    }
    .ant-image-img {
      width: auto!important;
    }
    .ant-btn:hover, .ant-btn:focus{
      border-color: transparent!important;
    }
    .ant-notification-notice-warning.ant-notification-notice{
      background: #F63C45!important;
    }
    .ant-notification-notice-info.ant-notification-notice {
      background: #2F86FF!important;
    }
    .ant-notification-notice-success.ant-notification-notice {
      background: #8CF6F4!important;
    }
    .ant-notification-notice {
      min-width: 246px!important;
      border-radius: 10px!important;
      min-height: 70px;
      padding: 0;
    }
    .ant-notification-notice-description{
      margin-left: 0!important;
      text-align: center;
      font-family: 'Inter'-apple-system,BlinkMacSystemFont!important ;
      font-size: 18px!important;
      font-weight: bold!important;
    }
    .ant-notification-notice-icon,
    .ant-notification-notice-close{
      display: none!important;
    }
    .ant-row {
        display: flex;
        flex-flow: row wrap;

        &::before,
        &::after {
            display: flex;
        }

        // No wrap of flex
        &-no-wrap {
            flex-wrap: nowrap;
        }
    }

    // x轴原点
    .ant-row-start {
        justify-content: flex-start;
    }

    // x轴居中
    .ant-row-center {
        justify-content: center;
    }

    // x轴反方向
    .ant-row-end {
        justify-content: flex-end;
    }

    // x轴平分
    .ant-row-space-between {
        justify-content: space-between;
    }

    // x轴有间隔地平分
    .ant-row-space-around {
        justify-content: space-around;
    }

    // 顶部对齐
    .ant-row-top {
        align-items: flex-start;
    }

    // 居中对齐
    .ant-row-middle {
        align-items: center;
    }

    // 底部对齐
    .ant-row-bottom {
        align-items: flex-end;
    }

    .ant-col {
        position: relative;
        max-width: 100%;
        // Prevent columns from collapsing when empty
        min-height: 1px;
    }

  
</style>
